<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>添加轮播图</title>
        <script src="/layui/layui.js"></script>
        <script src="/jquery/jquery-3.2.1.min.js"></script>
        <link rel="stylesheet" href="/layui/css/layui.css">
        <link rel="stylesheet" href="/css/banner/bannerManage/bannerList/add-banner.css">
        <script src="/js/banner/bannerManage/bannerList/add-banner.js"></script>
        <script src="/js/public/public.js"></script>
    </head>
    <body>
        <div class="layui-row">
            <div class="layui-col-md12">
                <div class="list">
                    <div class="list-left layui-col-md8">
                        <div class="list-left-left"></div>
                        <p class="list-left-right" id="title">轮播图列表</p>
                    </div>
                    <div class="list-right layui-col-md4">
                        <div class="queryButtonBox">
                            <div class="list-right-left layui-btn layui-icon layui-icon-refresh" id="refresh">&nbsp;刷新</div>
                            <div class="list-right-right layui-btn layui-icon layui-icon-left" id="goBack">&nbsp;返回</div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="banners layui-col-md12">
                <div class="bannersForm">
                    <form class="layui-form">
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">轮播图名称:</label>
                                <div class="layui-input-inline">
                                    <input name="imgTitle" id="imgTitle" placeholder="请输入轮播图名称" class="layui-input" lay-verify="required"  required />
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item"  style="display: inline-block">
                            <label class="layui-form-label">图片类型：</label>
                            <div class="layui-input-inline">
                                <select class="layui-select" lay-verify="required" name="imgType" id="imgType">
                                    <option value="">请选择</option>
                                    <option value="2">商品</option>
                                    <option value="3">视频<option>
                                </select>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">开始时间:</label>
                                <div class="layui-input-inline">
                                    <input name="startDate" id="startDate" placeholder="请选择开始时间" class="layui-input" lay-verify="required"  required />
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">结束时间:</label>
                                <div class="layui-input-inline">
                                    <input name="expireDate" id="expireDate" placeholder="请选择结束时间" class="layui-input" lay-verify="required"  required />
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item"style="display: inline-block" >
                            <label class="layui-form-label">是否上线：</label>
                            <div class="layui-input-inline">
                                <select class="layui-select" lay-verify="required" name="display" id="display">
                                    <option value="">请选择</option>
                                    <option value="2">上线</option>
                                    <option value="3">下线</option>
                                </select>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">轮播图描述:</label>
                                <div class="layui-input-inline">
                                    <input name="describe" placeholder="请输入轮播图描述" id="describe" lay-verify="required"  class="layui-input" />
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">上传图片:</label>
                                <div class="layui-input-inline">
                                    <button type="button" class="layui-btn" id="uploadBannerImg">上传图片</button>
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <div class="layui-input-inline">
                                    <div class="layui-progress layui-progress-big" lay-filter="imgProgress" lay-showPercent="yes">
                                        <div class="layui-progress-bar layui-bg-green" lay-percent="0%"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">图片预览:</label>
                                <div class="layui-input-inline">
                                    <img src="http://101.200.239.240:80/group1/M00/00/00/rBmy-mHdLQ-AATi_AAAj37cssag979.png" id="bannerImg" >
                                    <input type="hidden" name="imgAddress" lay-verify="imgAddress" id="imgAddress" >
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">上传视频:</label>
                                <div class="layui-input-inline" id="videoButton">
                                    <button type="button" class="layui-btn" id="uploadBannerViedo">上传视频</button>
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <div class="layui-input-inline">
                                    <div class="layui-progress layui-progress-big" lay-filter="videoProgress" lay-showPercent="yes">
                                        <div class="layui-progress-bar layui-bg-green" lay-percent="0%"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">视频预览:</label>
                                <div class="layui-input-inline">
                                    <video src="" id="bannerViedo" width="300" height="200" controls="controls" autoplay="autoplay"></video>
                                    <input type="hidden" name="videoAddress" lay-verify="videoAddress" id="videoAddress">
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">广告备注:</label>
                                <div class="layui-input-inline">
                                    <textarea id="remarks" name="remarks" style="resize:none;" placeholder="请输入备注内容" lay-verify="required"  class="layui-textarea"></textarea>
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label"></label>
                                <div class="layui-input-inline">
                                    <button type="submit" class="layui-btn" id="addBanner" lay-filter="sub" lay-submit>添加轮播图</button>
                                </div>
                            </div>
                        </div>
                        <input name="createId" type="hidden" id="createId">
                    </form>
                </div>
            </div>
        </div>
    </body>
</html>